<template>
  <div>
    <input
      type="text"
      v-model="val"
      placeholder="输入关键字搜索"
      @keyup.enter="search"
      @blur="search"
    />
    <TableBox :arr="records"></TableBox>
    <ItemBox></ItemBox>
  </div>
</template>
<script>
import TableBox from './components1/TableBox.vue'
import ItemBox from './components1/ItemBox.vue'
const arr = [
  {
    date: '2022-01-01',
    doctor: '张三',
    diagnosis: '感冒',
    prescription: '感冒药'
  },
  {
    date: '2022-02-01',
    doctor: '李四',
    diagnosis: '头疼',
    prescription: '止疼药'
  },
  {
    date: '2022-03-01',
    doctor: '王五',
    diagnosis: '腰痛',
    prescription: '止痛贴'
  }
]
export default {
  components: {
    TableBox,
    ItemBox
  },
  data () {
    return {
      val: '',
      records: arr
    }
  },
  created () {
  },
  computed: {
  },
  methods: {
    search () {
      if (this.val === '') {
        return this.records = arr
      }
      this.records = arr
      this.records = this.records.filter(item => item.doctor === this.val)
    }
  }
}
</script>
<style lang='less'  scoped>
</style>
